简介：在网页中传统的照片查看一直是网格-列表，现在我们可以突破这种限制，获得和现实中一样的自由。随意摆放的照片，超酷的切换动画；还能翻开照片，查看图片简介。
本课程主要有两个部分；前半部分以原理分析和前端界面实现为主，后半部分则是脚本来处理的一些特效与总结。
第1章 前期准备
介绍了这个案例在现实生活中的原型，以及在其他的应用程序中的应用，同时还介绍了一种通用的分析方法，从 “VCD” 的角度去分析一个案例的实现。
第2章 前端界面
介绍了特效的源码结构，以及所需的素材。接着根据前期准备中介绍的 “V”（VIEW），把案例中所需要的界面素材全部编写出来。其中用 CSS 编写了大部分的视觉效果，以及对应特效的基本动作。并且通过浏览器开发工具，用手动切换的方式验证了3D切换的视觉动作特效。
第3章 JS脚本编写
介绍了这个案例中的“D”（DATA）数据部分，同时通过改造之前的 VIEW，通过一个函数把所有的海报的 HTML 通过脚本的形式生成并输出。然后通过一个随机数的算法，随机选中一个海报作为当前选中展现的海报。再接着通过计算左右分区的范围，把剩余的海报的位置和角度也随机分配了出去。最后结合“前端界面”部分中的翻转控制，完整实现了控制按钮的输出、翻转控制、以及自身的翻转特效。
第4章 优化与总结
介绍了通过一些简单的样式调整，使得整个特效的动作更加流畅，然后讲解了如何去兼容Firefox浏览器，接着给出了一些思考，如何调整切换动画。最后对案例中用到的特殊 CSS 以及 JS 中的一些特别的方法进行了总结。